<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Page Title</title>
  <style>
    .wrapper {
      display: grid;
      display: grid;
      grid-template-columns: 100px 50px 150px;
      grid-template-rows: 50px 50px;
      grid-gap: 5px;
    }

    .wrapper div {
      text-align: center;
      line-height: 50px;
    }

    .item1 {
      grid-column: 1 / 3;
      background: #95FFB4;
    }

    .item2 {
      background: #FCF368;
    }

    .item3 {
      grid-row: 2 / 4;
      background: #00FFFD;
    }

    .item4 {
      grid-column: 2 / 4;
      background: #F19DFF;
    }

    .item5 {
      background: #67FFCD;
    }

    .item6 {
      background: #FF944D;
    }
  </style>
</head>
<body>
  <div class="wrapper">
    <div class="item1">1</div>
    <div class="item2">2</div>
    <div class="item3">3</div>
    <div class="item4">4</div>
    <div class="item5">5</div>
    <div class="item6">6</div>
  </div>
</body>
</html>